<template>
    <div style="min-height: 100vh;background:#f5f5f5;" class="addAddress">          
        <van-address-edit
        :area-list="areaList"
        show-search-result
        :search-result="searchResult"
        :address-info="addressInfo"
        @focus="focus"
        @save="onSave"
        @change-area="changeArea"
        @change-detail="changeDetail"
        @delete="onDelete"/>
    </div> 
</template>

<script>
    import address from "@/request/area.js"
    import request from "@/request/index.js"
    export default {
        name: "addAddress",
        components: {
            
        },
        data() {
            return {
                data:{},
                chosenAddressId: '1',
                list: [],
                areaList:address.areas,
                first_id:'',
                second_id:'',
                third_id:'',
                address:'',
                searchResult: [],
                addressInfo:{
                    
                }
            }
        },
        watch:{
            
        },
        methods:{
            changeArea(values){
                this.first_id=values[0].code;
                this.second_id=values[1].code;
                this.third_id=values[2].code;
            },
            onSave(save) {
                request.addAddress(this,save)
            },
            onDelete() {
                
            },
        },
        mounted() {
            this.first_id=this.$route.query.first_id,
            this.second_id=this.$route.query.second_id,
            this.third_id=this.$route.query.third_id,
            document.querySelector('input[type=tel]').setAttribute("maxLength", 11);
            if(this.$route.query.addressId){
                this.addressInfo={
                    name:this.$route.query.name,
                    tel:this.$route.query.tel,
                    addressDetail:this.$route.query.address,
                    areaCode:this.$route.query.area,
                    isDefault:!!(Number(this.$route.query.is_default)),
                }
            }
        },
    }
</script>

<style scoped lang="scss">

</style>
